<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Bernd Ruecker">
  <title>Flowing retail example</title>

  <!-- Bootstrap -->
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link href="css/style.css" rel="stylesheet">
  <link href="css/themify-icons.css" rel="stylesheet">
  <link href='css/dosis-font.css' rel='stylesheet' type='text/css'>
  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
    </head>
    <body id="page-top" data-spy="scroll" data-target=".side-menu">
      <nav class="side-menu">
        <ul>
          <li class="hidden active">
            <a class="page-scroll" href="#page-top"></a>
          </li>

          <li>
            <a href="#speakers" class="page-scroll">
              <span class="menu-title">Microservices</span>
              <span class="dot"></span>
            </a>
          </li>
          
        </ul>
      </nav>
      <div class="container-fluid">
        <!-- Start: Header -->
        <div class="row hero-header" id="home">
          <div class="col-md-7">
            <h1>Flowing retail - order fullfilment example in a microservice world</h1>
            <h4>Using Apache Kafka, Spring Boot and Camunda</h4>
            <a href="https://github.com/berndruecker/flowing-retail" class="">See source code on Github</a>
          </div>
        </div>
        <!-- End: Header -->
      </div>
      <div class="container">
        

        <!-- Start: Speakers -->
        <div class="row me-row content-ct speaker" id="speakers">
          <h2 class="row-title">Microservices</h2>
          <div class="col-md-4 col-sm-6 feature">
            <img src="img/checkout.png" class="speaker-img">
            <h3>Checkout</h3>
            <p>The checkout simulates the dash button by presenting an absolutely awesome UI. Check it out to checkout things...</p>
            <p><a href="http://localhost:8091/">http://localhost:8091</a></p>
          </div>
          <div class="col-md-4 col-sm-6 feature">
            <img src="img/order.png" class="speaker-img">
            <h3>Order Camunda</h3>
            <p>In case you use Camunda for orchestrating the order flow you can access the Camunda Cockpit for this service to get an overview...</p>
            <p><a href="http://localhost:8092/app/cockpit/default/">http://localhost:8092/</a></p>
          </div>
          <div class="col-md-4 col-sm-6 feature">
            <img src="img/payment.png" class="speaker-img">
            <h3>Payment Camunda</h3>
            <p>The payment microservice is responsible to get the money from the customer. There is one version using Camunda to solve problems around long running flows. If you use this you can access Camunda Cockpit to get an overview...</p>
            <p><a href="http://localhost:8093/app/cockpit/default/">http://localhost:8093/</a></p>
          </div>
          <div class="col-md-4 col-sm-6 feature">
            <img src="img/monitor.png" class="speaker-img">
            <h3>Monitor</h3>
            <p>You want to see what is going on in your microservice world? Checkout this simple monitor showing you all events &amp; commands sent around, and some BPMN view of the overall end-to-end business capability...</p>
            <p><a href="http://localhost:8095/">http://localhost:8095/</a></p>
          </div>
          <div class="col-md-4 col-sm-6 feature">
            <img src="img/monitor.png" class="speaker-img">
            <h3>Zeebe Simple Monitor</h3>
            <p>In case you use Zeebe for orchestration this simple monitor gives you some insides on what is going on...</p>
            <p><a href="http://localhost:8096/">http://localhost:8096/</a></p>
          </div>          
        </div>
        <!-- End: Speakers -->
      </div>

      

     

      <!-- Start: Footer -->
      <div class="container-fluid footer">        
        <div class="row footer-credit">
          <div class="col-md-6 col-sm-6">
            <p>&copy; 2017, <a href="http://berndruecker.io">Build with passion by berndruecker</a>.</p>
          </div>
        </div>
      </div>
      <!-- End: Footer -->

    </body>
    </html>